<template>
<view :class="'tab-bar ' + [isAllScreen ? 'all-screen-bar' : 'normal-bar']">
   		<view class="tab-bar-border"></view>
   		<view v-for="(item,index) in tabBarList" :key="index" class="tab-bar-item" :data-id="index"
   			@click="jump(item)">
   			<image :src="current == item.index ? item.selectedIconPath : item.iconPath"></image>
   			<view :style="{'color':current == item.index ? '#409eff' : '#909399'}" style="margin-top: 10rpx;">
   				{{item.text}}</view>
   		</view>
   	</view>
</template>

<script>
	import config from '@/common/config'
	import { getFontByKey } from '../../api/index.js'
	
	export default {
		props: {
			tabBarList: {
				type: Array,
				default: uni.getStorageSync('tabBarList')
			},
			current: Number
		},
		data() {
			return {
				value1: 0, // 默认页面
				inactiveColor: '#909399' ,// 高亮颜色
				userType:'',
				isAllScreen: config.isAllScreen
				
			}
		},
		onLaunch(){
			console.log('App 1234')
		},
		onLoad() {
			this.gettabbar()
			this.updateWordings()
		},
		methods: {
			// 更新文案配置并全局缓存
			updateWordings() {
        getFontByKey('wording.param1').then(res => {
					if (res.data) {
						uni.setStorageSync('max_amount', res.data)
					}
				})

        getFontByKey('wording.param2').then(res => {
					if (res.data) {
						uni.setStorageSync('annual_interest', res.data)
					}
				})

        getFontByKey('wording.param3').then(res => {
					if (res.data) {
						uni.setStorageSync('loan_period', res.data)
					}
				})
			},
			// 点击跳转对应tabbar页面
			jump(e) {
				// 切换菜单时更新文案配置
				this.updateWordings()
				uni.switchTab({
					url: e.pagePath
				})
			}
		}
	}

</script>

<style lang="less" scoped>
		.tab-bar {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			height: 55px;
			//border-top: 1px solid #ccc;
			background: white;
			display: flex;
		}
		.some-class {
		  padding-bottom: env(safe-area-inset-bottom); /* 兼容iOS 11.2+ */  
		  padding-bottom: constant(safe-area-inset-bottom); /* 兼容iOS 11.0-11.1.2 */  
		}
		.all-screen-bar{padding-bottom: 40rpx;}
		.normal-bar{padding-bottom: 0;}
		.tab-bar-border {
			// background-color: rgba(0, 0, 0, 0.33);
			background-color: white;
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 1px;
		}
		.tab-bar-item {
			flex: 1;
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			padding-top: 10px;
		}
		.tab-bar-item image {
			width: 24px;
			height: 24px;
		}
</style> 